<template>
    <div>
        <div align="center" style="font-weight: bold;font-size: 20px;margin-bottom: 20px;">{{stype}}理箱列表</div>
        <div style="margin-bottom:10px;">
            <el-row>
                <el-col :span="8">
                   单号:{{sform.shipPlanNo}}
                </el-col>
                <el-col :span="8">
                   船名:{{sform.shipName}} 
                </el-col>
                <el-col :span="8">
                   航次:{{sform.voyage}} 
                </el-col>
            </el-row>
            <!-- <el-row>
                <el-col :span="8">
                   起运港:{{sform.portName}}
                </el-col>
                <el-col :span="8">
                   到达港:{{sform.shipName}} 
                </el-col>
                <el-col :span="8">
                   船代:{{sCondition.search_LIKE_shipAgentName? 'sCondition.search_LIKE_shipAgentName': ''}} 
                </el-col>
            </el-row> -->
        </div>
        <table border="1" cellspacing="0" style="width: 98%;text-align: center;table-layout: fixed;" >
            <tr>
                <td>序号</td>
                <td>箱号</td>
                <td>场位</td>
                <td>总量</td>
                <td>货物属性</td>
                <td>内外贸</td>
                <td>卸货港</td>
                <td>卸区</td>
                <!-- <td>箱类</td> -->
                <td>箱型</td>
                <td>空重</td>
                <td>船代</td>
                <td>持箱人</td>
                <td width="80" style="text-overflow: ellipsis;overflow: hidden;white-space: nowrap;">货名</td>
                <td>货重</td>
                <td>备注</td>
            </tr>
            <tr v-for="(item,index) of list">
                <td>{{index+1}}</td>
                <td>{{item.containerId}}</td>
                <td>{{item.monthStage}}</td>
                <td>{{item.containerWeight}}</td>
                <td>{{item.cargoType}}</td>
                <td>{{item.tradeType | _filterTradeType }}</td>
                <td>{{item.unloadPort}}</td>
                <td>{{item.unloadArea}}</td>
                <td>{{item.containerType}}</td>
                <td>{{item.ef}}</td>
                <td>{{item.shipAgentName}}</td>
                <td>{{item.containerOwnerName}}</td>
                <td width="80" style="text-overflow: ellipsis;overflow: hidden;white-space: nowrap;">每年都所发生的是负担</td>
                <td>{{item.cargoWeight}}</td>
                <td>{{item.tallyRemark}}</td>
            </tr>
            <tr v-if="list.length == 0">
                <td colspan="9" style="text-align: center;">暂无数据</td>
            </tr>
        </table>
    </div>
</template>

<script>
    import { getOperationTotalReportByMonth } from "@/api/balance/balance";

    export default {
        name: "monthShipName",
        data() {
            return {
                stype :'',
                list : [],
                sform: {},
                sCondition: {}
            }
        },
        created() {
            this.loadData()
        },
        methods: {
            loadData() {
                this.stype=this.$route.query.type;
                if(this.stype == 1) {
                    this.stype = '装船' 
                }else{
                    this.stype = '卸船' 
                }
                this.sCondition = JSON.parse(localStorage.getItem('ShipPlanPrintCondition'))
                this.sform = JSON.parse(localStorage.getItem('ShipPlanPrintForm'))
                this.list = JSON.parse(localStorage.getItem('ShipPlanPrint'))
                console.log(this.sform)
                console.log(this.sCondition)
                console.log(this.list)
                this.$nextTick(() => {
                    window.print()
                    window.close();
                })
            }
        }
    }
</script>

<style scoped>

</style>
